<!DOCTYPE html>
<html>
    <head>
    <!--
        © Material Theme
        https://github.com/viosey/hexo-theme-material
        Version: 1.2.6 -->

    <!-- Title -->
    
    <title>
        
            sublime 快捷键精华版(转载) | 
        
        Julytian&#39;s blog
    </title>

    <!-- Favicons -->
    <link rel="icon shortcut" type="image/ico" href="/img/logo.jpg">
    <link rel="icon" sizes="192x192" href="/img/logo.jpg">
    <link rel="apple-touch-icon" href="/img/logo.jpg">

    <!-- Meta & Info -->
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="theme-color" content="#0097A7">
    <meta name="author" content="julytian">
    <meta name="description" content="julytian blog, write less do more">
    <meta name="keywords" content="julytian, 博客, 技术诗人, 前端开发者,vuejs">

    <!--iOS -->
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
    <meta name="apple-mobile-web-app-title" content="Title">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="HandheldFriendly" content="True">
    <meta name="MobileOptimized" content="480">

    <!-- Add to homescreen for Chrome on Android -->
    <meta name="mobile-web-app-capable" content="yes">

    <!-- Add to homescreen for Safari on iOS -->
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-title" content="Julytian&#39;s blog">

    <!-- The Open Graph protocol -->
    <meta property="og:url" content="http://julytian.coding.me">
    <meta property="og:type" content="blog">
    <meta property="og:title" content="sublime 快捷键精华版(转载) | Julytian&#39;s blog">
    <meta property="og:description" content="julytian blog, write less do more">

    <!--[if lte IE 9]>
        <link rel="stylesheet" href="/css/ie-blocker.css">

        
            <script src="/js/ie-blocker.zhCN.js"></script>
        
    <![endif]-->

    <!-- Import CSS -->
    <link rel="stylesheet" href="/css/material.min.css">
    <link rel="stylesheet" href="/css/style.min.css">
    <!-- Config CSS -->


<!-- Other Styles -->
<style>
    body, html {
        font-family: Roboto, "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
    }

    a {
        color: #00838F;
    }

    .mdl-card__media,
    #search-label,
    #search-form-label:after,
    #scheme-Paradox .hot_tags-count,
    #scheme-Paradox .sidebar_archives-count,
    #scheme-Paradox .sidebar-colored .sidebar-header,
    #scheme-Paradox .sidebar-colored .sidebar-badge{
        background-color: #0097A7 !important;
    }

    /* Sidebar User Drop Down Menu Text Color */
    #scheme-Paradox .sidebar-colored .sidebar-nav>.dropdown>.dropdown-menu>li>a:hover,
    #scheme-Paradox .sidebar-colored .sidebar-nav>.dropdown>.dropdown-menu>li>a:focus {
        color: #0097A7 !important;
    }

    #post_entry-right-info,
    .sidebar-colored .sidebar-nav li:hover > a,
    .sidebar-colored .sidebar-nav li:hover > a i,
    .sidebar-colored .sidebar-nav li > a:hover,
    .sidebar-colored .sidebar-nav li > a:hover i,
    .sidebar-colored .sidebar-nav li > a:focus i,
    .sidebar-colored .sidebar-nav > .open > a,
    .sidebar-colored .sidebar-nav > .open > a:hover,
    .sidebar-colored .sidebar-nav > .open > a:focus,
    #ds-reset #ds-ctx .ds-ctx-entry .ds-ctx-head a {
        color: #0097A7 !important;
    }

    .toTop {
        background: #EC407A !important;
    }

    .material-layout .material-post>.material-nav,
    .material-layout .material-index>.material-nav,
    .material-nav a {
        color: #EC407A;
    }

    #scheme-Paradox .MD-burger-layer {
        background-color: #EC407A;
    }

    #scheme-Paradox #post-toc-trigger-btn {
        color: #EC407A;
    }

    .post-toc a:hover {
        color: #00838F;
        text-decoration: underline;
    }
</style>


<!-- Theme Background Related-->

    <style>
        body{
            background-image: url(/img/bg.png);
        }
    </style>




<!-- Fade Effect -->

    <style>
        .fade {
            transition: all 800ms linear;
            -webkit-transform: translate3d(0,0,0);
            -moz-transform: translate3d(0,0,0);
            -ms-transform: translate3d(0,0,0);
            -o-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0);
            opacity: 1;
        }

        .fade.out{
            opacity: 0;
        }
    </style>


    <script src="/js/jquery.min.js"></script>

    <link rel="stylesheet" href="/css/highlight/solarized-white.css">

    <!-- UC Browser Compatible-->
    <script>
        var agent = navigator.userAgent.toLowerCase();
        if(agent.indexOf('ucbrowser')>0) {
            document.write('<link rel="stylesheet" href="/css/uc.css">');
            alert('由于 UC 浏览器使用极旧的内核，而本网站使用了一些新的特性。\n为了您能更好的浏览，推荐使用 Chrome 或 Firefox 浏览器。');
        }
    </script>

    <!-- Custom Head -->
    
</head>


    
        <body id="scheme-Paradox">
            <div class="material-layout  mdl-js-layout has-drawer is-upgraded">
                

                <!-- Main Container -->
                <main class="material-layout__content" id="main">

                    <!-- Top Anchor -->
                    <div id="top"></div>

                    
                        <!-- Hamburger Button -->
                        <button class="MD-burger-icon sidebar-toggle">
                            <span class="MD-burger-layer"></span>
                        </button>
                    

                    <!-- Post TOC -->

    
    <!-- Back Button -->
    <!--
    <div class="material-back" id="backhome-div" tabindex="0">
        <a class="mdl-button mdl-js-button mdl-js-ripple-effect mdl-button--icon"
           href="#" onclick="window.history.back();return false;"
           target="_self"
           role="button"
           data-upgraded=",MaterialButton,MaterialRipple">
            <i class="material-icons" role="presentation">arrow_back</i>
            <span class="mdl-button__ripple-container">
                <span class="mdl-ripple"></span>
            </span>
        </a>
    </div>
    -->

    <!-- Left aligned menu below button -->
    <button id="post-toc-trigger-btn"
        class="mdl-button mdl-js-button mdl-button--icon">
        <i class="material-icons">format_list_numbered</i>
    </button>

    <ul class="post-toc-wrap mdl-menu mdl-menu--bottom-left mdl-js-menu mdl-js-ripple-effect" for="post-toc-trigger-btn">
        <ol class="post-toc"><li class="post-toc-item post-toc-level-2"><a class="post-toc-link" href="#基础"><span class="post-toc-number">1.</span> <span class="post-toc-text">基础</span></a></li><li class="post-toc-item post-toc-level-2"><a class="post-toc-link" href="#选择类"><span class="post-toc-number">2.</span> <span class="post-toc-text">选择类</span></a></li><li class="post-toc-item post-toc-level-2"><a class="post-toc-link" href="#编辑类"><span class="post-toc-number">3.</span> <span class="post-toc-text">编辑类</span></a></li><li class="post-toc-item post-toc-level-2"><a class="post-toc-link" href="#搜索类"><span class="post-toc-number">4.</span> <span class="post-toc-text">搜索类</span></a></li><li class="post-toc-item post-toc-level-2"><a class="post-toc-link" href="#显示类"><span class="post-toc-number">5.</span> <span class="post-toc-text">显示类</span></a></li></ol>

        <!--
        <li class="mdl-menu__item">
            Some Action
        </li>
        -->
    </ul>




<!-- Layouts -->

    <!-- Post Module -->
    <div class="material-post_container">

        <div class="material-post mdl-grid">
            <div class="mdl-card mdl-shadow--4dp mdl-cell mdl-cell--12-col">

                <!-- Post Header(Thumbnail & Title) -->
                
    <!-- Paradox Post Header -->
    
        <!-- Custom Thumbnail -->
        <div class="post_thumbnail-custom mdl-card__media mdl-color-text--grey-50" style="background-image:url(http://upload-images.jianshu.io/upload_images/26219-79627bd9b96ce01f.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)">
    
            <p class="article-headline-p">
                sublime 快捷键精华版(转载)
            </p>
        </div>





                
                    <!-- Paradox Post Info -->
                    <div class="mdl-color-text--grey-700 mdl-card__supporting-text meta">

    <!-- Author Avatar -->
    <div id="author-avatar">
        <img src="/img/logo.jpg" width="44px" height="44px" alt="Author Avatar"/>
    </div>
    <!-- Author Name & Date -->
    <div>
        <strong>julytian</strong>
        <span>2月 08, 2017</span>
    </div>

    <div class="section-spacer"></div>

    <!-- Favorite -->
    <!--
        <button id="article-functions-like-button" class="mdl-button mdl-js-button mdl-js-ripple-effect mdl-button--icon btn-like">
            <i class="material-icons" role="presentation">favorite</i>
            <span class="visuallyhidden">favorites</span>
        </button>
    -->

    <!-- Qrcode -->
    
        <button id="article-functions-qrcode-button" class="mdl-button mdl-js-button mdl-js-ripple-effect mdl-button--icon">
            <i class="material-icons" role="presentation">devices other</i>
            <span class="visuallyhidden">devices other</span>
        </button>
        <ul class="mdl-menu mdl-menu--bottom-right mdl-js-menu mdl-js-ripple-effect" for="article-functions-qrcode-button">
            <li class="mdl-menu__item">在其它设备中阅读本文章</li>
            <img src="">
        </ul>
    

    <!-- Tags (bookmark) -->
    
    <button id="article-functions-viewtags-button" class="mdl-button mdl-js-button mdl-js-ripple-effect mdl-button--icon">
        <i class="material-icons" role="presentation">bookmark</i>
        <span class="visuallyhidden">bookmark</span>
    </button>
    <ul class="mdl-menu mdl-menu--bottom-right mdl-js-menu mdl-js-ripple-effect" for="article-functions-viewtags-button">
        <li class="mdl-menu__item">
        <a class="post_tag-link" href="/tags/sublime/">sublime</a>
    </ul>
    

    <!-- Share -->
    <button id="article-fuctions-share-button" class="mdl-button mdl-js-button mdl-js-ripple-effect mdl-button--icon">
    <i class="material-icons" role="presentation">share</i>
    <span class="visuallyhidden">share</span>
</button>
<ul class="mdl-menu mdl-menu--bottom-right mdl-js-menu mdl-js-ripple-effect" for="article-fuctions-share-button">
    

    
        
            <!-- Busuanzi Views -->
            <a class="post_share-link" href="#">
                <li class="mdl-menu__item">
                    <span id="busuanzi_container_page_pv">
                        <span id="busuanzi_value_page_pv"></span>&nbsp;浏览量
                    </span>
                </li>
            </a>
        
    

    <!-- Share Weibo -->
    
        <a class="post_share-link" href="http://service.weibo.com/share/share.php?appkey=&title=sublime 快捷键精华版(转载)&url=http://julytian.coding.me//2017/02/08/快捷键精华版（转载）/index.html&pic=&searchPic=false&style=simple" target="_blank">
            <li class="mdl-menu__item">
                分享到微博
            </li>
        </a>
    

    <!-- Share Twitter -->
    

    <!-- Share Facebook -->
    

    <!-- Share Google+ -->
    

    <!-- Share LinkedIn -->
    

    <!-- Share QQ -->
    
        <a class="post_share-link" href="http://connect.qq.com/widget/shareqq/index.html?site=Julytian&#39;s blog&title=sublime 快捷键精华版(转载)&summary=julytian blog, write less do more&pics=http://julytian.coding.me/img/logo.jpg&url=http://julytian.coding.me/2017/02/08/快捷键精华版（转载）/index.html" target="_blank">
            <li class="mdl-menu__item">
                分享到 QQ
            </li>
        </a>
    

    <!-- Share Telegram -->
    
</ul>

</div>

                

                <!-- Post Content -->
                <div id="post-content" class=" markdown-Github mdl-color-text--grey-700 mdl-card__supporting-text fade out">
    
        <script src="/assets/js/DPlayer.min.js"> </script><script src="/assets/js/APlayer.min.js"> </script><h2 id="基础"><a href="#基础" class="headerlink" title="基础"></a>基础</h2><a id="more"></a>
<p><code>Ctrl+Shift+P</code>：打开命令面板<br><code>Ctrl+P</code>：搜索项目中的文件<br><code>Ctrl+G</code>：跳转到第几行<br><code>Ctrl+W</code>：关闭当前打开文件<br><code>Ctrl+Shift+W</code>：关闭所有打开文件<br><code>Ctrl+Shift+V</code>：粘贴并格式化<br><code>Ctrl+D</code>：选择单词，重复可增加选择下一个相同的单词<br><code>Ctrl+L</code>：选择行，重复可依次增加选择下一行<br><code>Ctrl+Shift+L</code>：选择多行<br><code>Ctrl+Shift+Enter</code>：在当前行前插入新行<br><code>Ctrl+X</code>：删除当前行<br><code>Ctrl+M</code>：跳转到对应括号<br><code>Ctrl+U</code>：软撤销，撤销光标位置<br><code>Ctrl+J</code>：选择标签内容<br><code>Ctrl+F</code>：查找内容<br><code>Ctrl+Shift+F</code>：查找并替换<br><code>Ctrl+H</code>：替换<br><code>Ctrl+R</code>：前往method<br><code>Ctrl+N</code>：新建窗口<br><code>Ctrl+K+B</code>：开关侧栏<br><code>Ctrl+Shift+M</code>：选中当前括号内容，重复可选着括号本身<br><code>Ctrl+F2</code>：设置/删除标记<br><code>Ctrl+/</code>：注释当前行<br><code>Ctrl+Shift+/</code>：当前位置插入注释<br><code>Ctrl+Alt+/</code>：块注释，并Focus到首行，写注释说明用的<br><code>Ctrl+Shift+A</code>：选择当前标签前后，修改标签用的<br><code>F11</code>：全屏<br><code>Shift+F11</code>：全屏免打扰模式，只编辑当前文件<br><code>Alt+F3</code>：选择所有相同的词<br><code>Alt+.</code>：闭合标签<br><code>Alt+Shift+数字</code>：分屏显示<br><code>Alt+数字</code>：切换打开第N个文件<br><code>Shift+右键拖动</code>：光标多不，用来更改或插入列内容<br>鼠标的前进后退键可切换Tab文件<br>按Ctrl，依次点击或选取，可需要编辑的多个位置<br>按Ctrl+Shift+上下键，可替换行</p>
<h2 id="选择类"><a href="#选择类" class="headerlink" title="选择类"></a>选择类</h2><p><code>Ctrl+D</code>：选中光标所占的文本，继续操作则会选中下一个相同的文本。<br><code>Alt+F3</code>：选中文本按下快捷键，即可一次性选择全部的相同文本进行同时编辑。举个栗子：快速选中并更改所有相同的变量名、函数名等。<br><code>Ctrl+L</code>：选中整行，继续操作则继续选择下一行，效果和Shift+↓效果一样。<br><code>Ctrl+Shift+L</code>：先选中多行，再按下快捷键，会在每行行尾插入光标，即可同时编辑这些行。<br><code>Ctrl+Shift+M</code>：选择括号内的内容（继续选择父括号）。举个栗子：快速选中删除函数中的代码，重写函数体代码或重写括号内里的内容。<br><code>Ctrl+M</code>：光标移动至括号内结束或开始的位置。<br><code>Ctrl+Enter</code>：在下一行插入新行。举个栗子：即使光标不在行尾，也能快速向下插入一行。<br><code>Ctrl+Shift+Enter</code>：在上一行插入新行。举个栗子：即使光标不在行首，也能快速向上插入一行。<br><code>Ctrl+Shift+[</code>：选中代码，按下快捷键，折叠代码。<br><code>Ctrl+Shift+]</code>：选中代码，按下快捷键，展开代码。<br><code>Ctrl+K+0</code>：展开所有折叠代码。<br><code>Ctrl+←</code>：向左单位性地移动光标，快速移动光标。<br><code>Ctrl+→</code>：向右单位性地移动光标，快速移动光标。<br><code>shift+↑</code>：向上选中多行。<br><code>shift+↓</code>：向下选中多行。<br><code>Shift+←</code>：向左选中文本。<br><code>Shift+→</code>：向右选中文本。<br><code>Ctrl+Shift+←</code>：向左单位性地选中文本。<br><code>Ctrl+Shift+→</code>：向右单位性地选中文本。<br><code>Ctrl+Shift+↑</code>：将光标所在行和上一行代码互换（将光标所在行插入到上一行之前）。<br><code>Ctrl+Shift+↓</code>：将光标所在行和下一行代码互换（将光标所在行插入到下一行之后）。<br><code>Ctrl+Alt+↑</code>：向上添加多行光标，可同时编辑多行。<br><code>Ctrl+Alt+↓</code>：向下添加多行光标，可同时编辑多行。</p>
<h2 id="编辑类"><a href="#编辑类" class="headerlink" title="编辑类"></a>编辑类</h2><p><code>Ctrl+J</code>：合并选中的多行代码为一行。举个栗子：将多行格式的CSS属性合并为一行。<br><code>Ctrl+Shift+D</code>：复制光标所在整行，插入到下一行。<br><code>Tab</code>：向右缩进。<br><code>Shift+Tab</code>：向左缩进。<br><code>Ctrl+K+K</code>：从光标处开始删除代码至行尾。<br><code>Ctrl+Shift+K</code>：删除整行。<br><code>Ctrl+/</code>：注释单行。<br><code>Ctrl+Shift+/</code>：注释多行。<br><code>Ctrl+K+U</code>：转换大写。<br><code>Ctrl+K+L</code>：转换小写。<br><code>Ctrl+Z</code>：撤销。<br><code>Ctrl+Y</code>：恢复撤销。<br><code>Ctrl+U</code>：软撤销，感觉和Gtrl+Z一样。<br><code>Ctrl+F2</code>：设置书签<br><code>Ctrl+T</code>：左右字母互换。<br><code>F6</code>：单词检测拼写</p>
<h2 id="搜索类"><a href="#搜索类" class="headerlink" title="搜索类"></a>搜索类</h2><p><code>Ctrl+F</code>：打开底部搜索框，查找关键字。<br><code>Ctrl+shift+F</code>：在文件夹内查找，与普通编辑器不同的地方是sublime允许添加多个文件夹进行查找，略高端，未研究。<br><code>Ctrl+P</code>：打开搜索框。举个栗子：1、输入当前项目中的文件名，快速搜索文件，2、输入@和关键字，查找文件中函数名，3、输入：和数字，跳转到文件中该行代码，4、输入#和关键字，查找变量名。<br><code>Ctrl+R</code>：打开搜索框，自动带@，输入关键字，查找文件中的函数名。举个栗子：在函数较多的页面快速查找某个函数。<br><code>Ctrl+</code>：打开搜索框，自动带#，输入关键字，查找文件中的变量名、属性名等。<br><code>Ctrl+Shift+P</code>：打开命令框。场景栗子：打开命名框，输入关键字，调用sublime：text或插件的功能，例如使用package安装插件。<br><code>Esc</code>：退出光标多行选择，退出搜索框，命令框等。</p>
<h2 id="显示类"><a href="#显示类" class="headerlink" title="显示类"></a>显示类</h2><p><code>Ctrl+Tab</code>：按文件浏览过的顺序，切换当前窗口的标签页。<br><code>Ctrl+PageUp</code>：向右切换当前窗口的标签页。<br><code>Alt+Shift+1</code>：窗口分屏，恢复默认1屏（非小键盘的数字）<br><code>Alt+Shift+2</code>：左右分屏-2列<br><code>Alt+Shift+3</code>：左右分屏-3列<br><code>Alt+Shift+4</code>：左右分屏-4列<br><code>Alt+Shift+5</code>：等分4屏<br><code>Alt+Shift+9</code>：垂直分屏-3屏<br><code>Ctrl+K+B</code>：开启/关闭侧边栏。<br><code>F11</code>：全屏模式<br><code>Shift+F11</code>：免打扰模式</p>

    

    
</div>


                

                <!-- Post Comments -->
                
                    
    <!-- 使用多说评论 -->
    <link rel="stylesheet" href="/css/duoshuo.min.css">
<style>
    #ds-thread #ds-reset .ds-post-button{
        background-color: #0097A7 !important;
    }
    #ds-wrapper #ds-reset .ds-icons-32{
        background-color: #0097A7 !important;
    }
    #ds-reset .ds-highlight {
        color: #0097A7 !important;
    }
</style>
<div id="comments">
    <!-- 多说评论框 start -->
    <div class="ds-thread"
        data-thread-key=""
        data-url="http://julytian.coding.me/2017/02/08/快捷键精华版（转载）/"
        data-title="sublime 快捷键精华版(转载)">
    </div>
    <!-- 多说评论框 end -->
</div>





                
            </div>

            <!-- Post Prev & Next Nav -->
            <nav class="material-nav mdl-color-text--grey-50 mdl-cell mdl-cell--12-col">
    <!-- Prev Nav -->
    
        <a href="/2017/04/06/微信小程序踩坑笔记/" id="post_nav-newer" class="prev-content">
            <button class="mdl-button mdl-js-button mdl-js-ripple-effect mdl-button--icon mdl-color--white mdl-color-text--grey-900" role="presentation">
                <i class="material-icons">arrow_back</i>
            </button>
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            新篇
        </a>
    

    <!-- Section Spacer -->
    <div class="section-spacer"></div>

    <!-- Next Nav -->
    
        <a href="/2017/02/07/mongoose的简单学习/" id="post_nav-older" class="next-content">
            旧篇
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <button class="mdl-button mdl-js-button mdl-js-ripple-effect mdl-button--icon mdl-color--white mdl-color-text--grey-900" role="presentation">
                <i class="material-icons">arrow_forward</i>
            </button>
        </a>
    
</nav>

        </div>
    </div>



                    
                        <!-- Overlay For Active Sidebar -->
<div class="sidebar-overlay"></div>

<!-- Material sidebar -->
<aside id="sidebar" class="sidebar sidebar-colored sidebar-fixed-left" role="navigation">
    <div id="sidebar-main">
        <!-- Sidebar Header -->
        <div class="sidebar-header header-cover" style="background-image: url(/img/sidebar_header.png);">
    <!-- Top bar -->
    <div class="top-bar"></div>

    <!-- Sidebar toggle button -->
    <button type="button" class="sidebar-toggle mdl-button mdl-js-button mdl-js-ripple-effect mdl-button--icon" style="display: initial;" data-upgraded=",MaterialButton,MaterialRipple">
        <i class="material-icons">clear_all</i>
        <span class="mdl-button__ripple-container">
            <span class="mdl-ripple">
            </span>
        </span>
    </button>

    <!-- Sidebar Avatar -->
    <div class="sidebar-image">
        <img src="/img/logo.jpg" alt="julytian's avatar">
    </div>

    <!-- Sidebar Email -->
    <a data-toggle="dropdown" class="sidebar-brand" href="#settings-dropdown">
        992113471@qq.com
        <b class="caret"></b>
    </a>
</div>


        <!-- Sidebar Navigation  -->
        <ul class="nav sidebar-nav">
    <!-- User dropdown  -->
    <li class="dropdown">
        <ul id="settings-dropdown" class="dropdown-menu">
            
                <li>
                    <a href="http://weibo.com/Julytian" target="_blank" title="Chat With Me">
                        <i class="material-icons sidebar-material-icons sidebar-indent-left1pc-element">email</i>
                        Chat With Me
                    </a>
                </li>
            
        </ul>
    </li>

    <!-- Homepage -->
    <li id="sidebar-first-li">
        <a href="/" target="_self">
            <i class="material-icons sidebar-material-icons">home</i>
            主页
        </a>
    </li>

    <!-- I'm Feeling Lucky -->
    <!--
    <li class="dropdown">
        <a href="" target="_self">
            <i class="material-icons sidebar-material-icons">explore</i>
             sidebar.imlucky
        </a>
    </li>
    -->

    <!-- Archives  -->
    <li class="dropdown">
        <a href="#" class="ripple-effect dropdown-toggle" data-toggle="dropdown">
            <i class="material-icons sidebar-material-icons">inbox</i>
             归档
            <b class="caret"></b>
        </a>
        <ul class="dropdown-menu">
            <li>
            <a class="sidebar_archives-link" href="/archives/2017/04/">四月 2017<span class="sidebar_archives-count">4</span></a></li><li><a class="sidebar_archives-link" href="/archives/2017/02/">二月 2017<span class="sidebar_archives-count">5</span></a>
        </ul>
    </li>

    <!-- Categories  -->
    
        <li class="dropdown">
            <a href="#" class="ripple-effect dropdown-toggle" data-toggle="dropdown">
                <i class="material-icons sidebar-material-icons">chrome_reader_mode</i>
                分类
                <b class="caret"></b>
            </a>
            <ul class="dropdown-menu">
                <li>
                <a class="sidebar_archives-link" href="/categories/nodejs/">nodejs<span class="sidebar_archives-count">1</span></a></li><li><a class="sidebar_archives-link" href="/categories/vue/">vue<span class="sidebar_archives-count">2</span></a></li><li><a class="sidebar_archives-link" href="/categories/学习/">学习<span class="sidebar_archives-count">1</span></a></li><li><a class="sidebar_archives-link" href="/categories/微信小程序/">微信小程序<span class="sidebar_archives-count">2</span></a></li><li><a class="sidebar_archives-link" href="/categories/生活/">生活<span class="sidebar_archives-count">1</span></a></li><li><a class="sidebar_archives-link" href="/categories/移动端/">移动端<span class="sidebar_archives-count">1</span></a></li><li><a class="sidebar_archives-link" href="/categories/编辑器/">编辑器<span class="sidebar_archives-count">1</span></a>
            </ul>
        </li>
    

    <!-- Divider -->
    <li class="divider"></li>


    <!-- Pages  -->
  	
        <li>
            <a href="/about/" title="About">
                
                    <i class="material-icons sidebar-material-icons">person</i>
                
                About
            </a>
        </li>
  	
        <li>
            <a href="/tags/" title="标签云">
                
                    <i class="material-icons sidebar-material-icons">person</i>
                
                标签云
            </a>
        </li>
  	

    <!-- Article Numebr  -->
    <li>
        <a href="/archives">
            文章总数
            <span class="sidebar-badge">9</span>
        </a>
    </li>
</ul>


        <!-- Sidebar Divider -->
        <div class="sidebar-divider"></div>

        <!-- Sidebar Footer -->
        <!--
I'm glad you use this theme, the development is no so easy, I hope you can keep the copyright, I will thank you so much.
If you still want to delete the copyrights, could you still retain the first one? Which namely "Theme Material"
It will not impact the appearance and can give developers a lot of support :)

很高兴您使用并喜欢该主题，开发不易 十分谢谢与希望您可以保留一下版权声明。
如果您仍然想删除的话 能否只保留第一项呢？即 "Theme Material"
它不会影响美观并可以给开发者很大的支持和动力。 :)
-->

<!-- Theme Material -->
<a href="https://github.com/viosey/hexo-theme-material"  class="sidebar-footer-text-a" target="_blank">
    <div class="sidebar-text mdl-button mdl-js-button mdl-js-ripple-effect sidebar-footer-text-div" data-upgraded=",MaterialButton,MaterialRipple">
        主题 - Material
        <span class="sidebar-badge badge-circle">i</span>
    </div>
</a>

<!-- Help & Support -->
<!--
<a href="mailto:hiviosey@gmail.com" class="sidebar-footer-text-a">
    <div class="sidebar-text mdl-button mdl-js-button mdl-js-ripple-effect sidebar-footer-text-div" data-upgraded=",MaterialButton,MaterialRipple">
    sidebar.help
    <span class="mdl-button__ripple-container">
      <span class="mdl-ripple"></span>
    </span>
  </div>
</a>
-->

<!-- Feedback -->
<!--
<a href="https://github.com/viosey/hexo-theme-material/issues" target="_blank" class="sidebar-footer-text-a">
    <div class="sidebar-text mdl-button mdl-js-button mdl-js-ripple-effect sidebar-footer-text-div" data-upgraded=",MaterialButton,MaterialRipple">
         sidebar.feedback
                    <span class="mdl-button__ripple-container"><span class="mdl-ripple"></span></span></div>
</a>
-->

<!-- Abount Theme -->
<!--
<a href="https://blog.viosey.com/index.php/Material.html" target="_blank" class="sidebar-footer-text-a">
    <div class="sidebar-text mdl-button mdl-js-button mdl-js-ripple-effect sidebar-footer-text-div" data-upgraded=",MaterialButton,MaterialRipple">
         sidebar.about_theme
        <span class="mdl-button__ripple-container"><span class="mdl-ripple"></span></span></div>
</a>-->

    </div>

    <!-- Sidebar Sponsor -->
    

</aside>

                    

                    
                        <!-- Footer Top Button -->
                        <div class="toTop-wrap">
    <a href="#top" class="toTop">
        <i class="material-icons footer_top-i">expand_less</i>
    </a>
</div>

                    

                    <!--Footer-->
<footer class="mdl-mini-footer" id="bottom">
    
        <!-- Paradox Footer Left Section -->
        <div class="mdl-mini-footer--left-section sns-list">
    <!-- Twitter -->
    

    <!-- Facebook -->
    

    <!-- Google + -->
    

    <!-- Weibo -->
    
        <a href="http://weibo.com/Julytian" target="_blank">
            <button class="mdl-mini-footer--social-btn social-btn" style="background-image: url(/img/footer/footer_ico-weibo.png);">
                <span class="visuallyhidden">Weibo</span>
            </button><!--
     --></a>
    

    <!-- Instagram -->
    

    <!-- Tumblr -->
    

    <!-- Github -->
    
        <a href="https://github.com/julytian" target="_blank">
            <button class="mdl-mini-footer--social-btn social-btn" style="background-image: url(/img/footer/footer_ico-github.png);">
                <span class="visuallyhidden">Github</span>
            </button><!--
     --></a>
    

    <!-- LinkedIn -->
    

    <!-- Zhihu -->
    
        <a href="http://www.zhihu.com/people/julytian" target="_blank">
            <button class="mdl-mini-footer--social-btn social-btn" style="background-image: url(/img/footer/footer_ico-zhihu.png);">
                <span class="visuallyhidden">Zhihu</span>
            </button><!--
     --></a>
    

    <!-- Bilibili -->
    

    <!-- Telegram -->
    
</div>


        <!--Copyright-->
        <div id="copyright">
            Copyright&nbsp;©&nbsp;
            <script type="text/javascript">
                var fd = new Date();
                document.write(fd.getFullYear());
            </script>
            &nbsp;Julytian's blog

              <div id="days"></div>
<script src="https://cdn.bootcss.com/moment.js/2.17.0/moment.min.js">
//这里调用了公共库中现成的 js 文件，也可以直接调用站点中的 js 文件
</script>
<script>
	var begin = moment([2017,01,06]); //定义博客开始时间
	var now = moment(); //使用 moment() 获取当前时间
    document.getElementById('days').innerHTML ="博客已运行 "+ now.diff(begin,'days') +" 天"
// 使用 now.diff(begin,'days') 函数获取天数，这里天数考虑了闰年
</script>
        </div>

        <div class="mdl-mini-footer--right-section">
            <div>
                <div class="footer-develop-div">Powered by <a href="https://hexo.io" target="_blank" class="footer-develop-a">Hexo</a></div>
            </div>
        </div>
    
</footer>


                    <!-- Import File -->
<script src="/js/highlight.min.js"></script>
<script src="/js/js.min.js"></script>
<script src="/js/nprogress.js"></script>

<script type="text/javascript">
    NProgress.configure({
        showSpinner: true
    });
    NProgress.start();

    $('#nprogress .bar').css({
        'background': '#FF4081'
    });
    $('#nprogress .peg').css({
        'box-shadow': '0 0 10px #FF4081, 0 0 15px #FF4081'
    });
    $('#nprogress .spinner-icon').css({
        'border-top-color': '#FF4081',
        'border-left-color': '#FF4081'
    });

    setTimeout(function() {
        NProgress.done();
        $('.fade').removeClass('out');
    }, 800);
</script>



    <script src="/js/smoothscroll.js"></script>





    <!-- Busuanzi -->
    <script src="https://dn-lbstatics.qbox.me/busuanzi/2.3/busuanzi.pure.mini.js"></script>



    <!-- 多说公共 js 代码 start -->
    <script type="text/javascript">
        var duoshuoQuery = {
            short_name: 'wenyiyuan'
        };
        (function() {
            var ds = document.createElement('script');
            ds.type = 'text/javascript';
            ds.async = true;
            ds.src = 'https://static.duoshuo.com/embed.js';
            ds.charset = 'UTF-8';
            (document.getElementsByTagName('head')[0]
             || document.getElementsByTagName('body')[0]).appendChild(ds);
        })();
    </script>
    <!-- 多说公共 js 代码 end -->





<!-- Swiftye -->


<!-- Local Search-->

    <script>
    var searchFunc = function(path, search_id, content_id) {
        'use strict';
        $.ajax({
            url: path,
            dataType: 'xml',
            success: function( xmlResponse ) {
                // get the contents from search data
                var datas = $( 'entry', xmlResponse ).map(function() {
                    return {
                        title: $( 'title', this ).text(),
                        content: $('content',this).text(),
                        url: $( 'url' , this).text()
                    };
                }).get();
                var $input = document.getElementById(search_id);
                var $resultContent = document.getElementById(content_id);
                $input.addEventListener('input', function() {
                    var str='<ul class=\"search-result-list\">';
                    var keywords = this.value.trim().toLowerCase().split(/[\s\-]+/);
                    $resultContent.innerHTML = "";
                    if (this.value.trim().length <= 0) {
                        return;
                    }
                    // perform local searching
                    datas.forEach(function(data) {
                        var isMatch = true;
                        var content_index = [];
                        var data_title = data.title.trim().toLowerCase();
                        var data_content = data.content.trim().replace(/<[^>]+>/g,"").toLowerCase();
                        var data_url = data.url;
                        var index_title = -1;
                        var index_content = -1;
                        var first_occur = -1;
                        // only match artiles with not empty titles and contents
                        if(data_title != '' && data_content != '') {
                            keywords.forEach(function(keyword, i) {
                                index_title = data_title.indexOf(keyword);
                                index_content = data_content.indexOf(keyword);
                                if( index_title < 0 && index_content < 0 ) {
                                    isMatch = false;
                                } else {
                                    if (index_content < 0) {
                                        index_content = 0;
                                    }
                                    if (i === 0) {
                                        first_occur = index_content;
                                    }
                                }
                            });
                        }
                        // show search results
                        if (isMatch) {
                            str += '<li><a href="'+ data_url +'" class="search-result-title" target="_blank">'+ data_title;
                            var content = data.content.trim().replace(/<[^>]+>/g, '');
                            if (first_occur >= 0) {
                                // cut out characters
                                var start = first_occur - 6;
                                var end = first_occur + 6;
                                if (start < 0) {
                                    start = 0;
                                }
                                if (start === 0) {
                                    end = 10;
                                }
                                if (end > content.length) {
                                    end = content.length;
                                }
                                var match_content = content.substr(start, end);
                                // highlight all keywords
                                keywords.forEach(function(keyword) {
                                    var regS = new RegExp(keyword, 'gi');
                                    match_content = match_content.replace(regS, '<em class="search-keyword">'+keyword+'</em>');
                                })
                                str += '<p class="search-result">' + match_content +'...</p>' +'</a>';
                            }
                        }
                    });
                    $resultContent.innerHTML = str;
                });
            }
        });
    }
</script>


    <script>
        var inputArea = document.querySelector('#search');
        var getSearchFile = function() {
            var path = 'search.xml';
            searchFunc(path, 'search', 'local-search-result');
        }

        if(inputArea) {
            inputArea.onfocus = function() {
                getSearchFile();
            }
        }
    </script>


<!-- Window Load-->
<script>
    $(window).load(function() {
        // Post_Toc parent position fixed
        $('.post-toc-wrap').parent('.mdl-menu__container').css('position', 'fixed');
    });
</script>

<!-- MathJax Load-->


                </main>
            </div>
        </body>
    
</html>
